<template>
	<view class="login">
		<!-- 登录页面 -->
		<view class="title">
			账号密码登录
		</view>

		<!-- 两个输入框 -->
		<input type="text" class="inp" v-model="username" placeholder="请输入用户名" />
		<input type="text" class="inp" v-model="password" placeholder="请输入密码" password />
		<view style="height: 25rpx; color: #FF5C50; font-size: 26rpx; margin-top: 20rpx;">
			<span v-show='error'>用户不存在/密码错误</span>
		</view>


		<button type="primary" v-on:click="login" class="btn" style="background-color: #58f">登录</button>

		<!-- 提示文本 -->
		<view class="tips">
			<text class="item blue" @click="loginByCode">验证码登录</text>
			<text class="item blue" @click="signup">注册</text>
			<text class="item">忘记密码？</text>

		</view>
	</view>
</template>

<script>
	{}
	import utils from "../../common/utils.js";
	const api = utils.websiteUrl;
	export default {
		data() {
			return {
				error: false,
				username: "",
				password: ""
			}
		},
		methods: {
			login: function() {
				// 在前端做一个简单验证
				// 验证通过：发请求
				// 验证不通过：提示用户
				if (this.username && this.password) {
					var that = this;

					// 通过
					uni.request({
						// url: "https://mock.apifox.cn/m1/2227626-0-default/login",
						// url: "https://frp-can.top:16688/user/login2",
						url: api + "user/login2",
						method: 'POST',
						sslVerify: false,
						data: {
							"userName": that.username,
							"password": that.password,
						},
						header: {
							'content-type': 'application/x-www-form-urlencoded;charset=utf-8',
						},
						success: (res) => {
							console.log("响应结果", res)
							if (res.data.code == 0) {
								// if (res.data.status == 0) {

								that.error = false;
								uni.setStorageSync("isLogin", true);
								uni.setStorageSync("username", that.username);
								uni.setStorageSync('userinfo', JSON.stringify(res.data.data))
								uni.setStorageSync('token', res.header.token);
								uni.showToast({
									icon: 'success',
									title: '登录成功',
									duration: 1000
								});

								if (res.data.data.identity == 0) {
									uni.switchTab({
										url: '/pages/index/index'
									})
								} else {
									uni.redirectTo({
										url: "/pages/index_driver/index_driver"
									})
								}


							} else {
								that.error = true;
								that.password = ''
							}
						},
						fail: (err) => {
							console.log(err)
						}
					})
				} else {
					// 不通过
					uni.showToast({
						title: "不能为空",
						icon: 'error'
					})
				}
			},
			signup: function() {
				uni.redirectTo({
					url: "/pages/signup/signup"
				})
			},
			loginByCode(){
				uni.redirectTo({
					url:"/pages/loginbycode/loginbycode"
				})
			}
		}
	}
</script>

<style lang="scss">
	.login {
		padding: 0 60rpx;

		.title {
			font-size: 60rpx;
			color: #0f80ff;
			margin: 100rpx 0;
		}

		.inp {
			background-color: #f7f7f7;
			height: 100rpx;
			border-radius: 20rpx;
			padding-left: 20rpx;
			margin-bottom: 40rpx;
		}

		.btn {
			border-radius: 20rpx;
			margin-top: 100rpx;
		}

		.tips {
			margin-top: 40rpx;
			font-size: 14px;
			color: #aaa;
			text-align: center;

			.blue {
				color: skyblue;
				border-right: 1px solid #aaa;
			}

			.item {
				padding: 0 20rpx;
				line-height: 1;
				// margin: 0 0;
			}
		}
	}
</style>